<template>
  <div>
       <page-header title="三方违约处理" content="tripartiteAdmin" />
       <page-main title="">
           <el-row>
               <el-col :span="12">
                   <el-row>
                        提交人：{{stuname}}
                    </el-row>
                    <br>
                    <el-row>
                        提交时间：{{form.timestamp1}}
                    </el-row>
                    <br>
                    <el-row v-if="form.level == '1'">
                        阶段：已发起违约
                    </el-row>
                    <el-row v-if="form.level == '2'">
                        阶段：已提交违约文件以及原三方
                    </el-row>
                    <el-row v-if="form.level == '3'">
                        阶段：已经回收原三方
                    </el-row>
                    <el-row v-if="form.level == '4'">
                        阶段：已发放新三方文件
                    </el-row>
                    <br>
                    <el-row v-if="form.level >= 2">
                        学生提交文件：
                        <el-button icon="el-icon-download" style="margin: 0 auto;">
                            <el-link type="info">
                                <a :href="form.filepath" download>下载</a>
                            </el-link>
                        </el-button>
                    </el-row>
                    <br>
                    <el-row v-if="JSON.parse(form.abrogation)">
                        <h3>流程已终止！</h3>
                    </el-row>
               </el-col>
               <el-col :span="12">
                   <el-button icon="el-icon-s-claim" round @click="tripartiteRecover()" v-if="form.level == '2'">文件回收</el-button>
                   <el-button icon="el-icon-s-claim" round @click="tripartiteIssue()" v-if="form.level == '3'">三方发放</el-button>
               </el-col>
           </el-row>
       </page-main>
  </div>

</template>

<script>
import Date from '../../../util/date'
export default {
    name: 'tripartiteProcess',
    data() {
        return {
            type: '',
            title: '',
            id: '',
            form: {},
            stuname: 'xxx',
            professionList: []
        }
    },
    beforeRouteEnter(to, from, next) {
        let that = this
        next(vm => {
            // 通过 `vm` 访问fetchData，将query参数name，传递过去，进行逻辑处理
            // that.type = vm.$route.params.type
            vm.fetchData(vm.$route.params.id);
        });
    },
    methods: {
        fetchData(id) {
            this.id = id
            this.$util.post('public/selectTripartiteByPrimaryKey',{id: id}).then(res => {
                this.form = res
                this.$util.post('public/loadUserdetailByUid',{uid: res.uid}).then(res1 => {
                    this.stuname = res1.nickname
                })
            })
        },
        tripartiteRecover() {
            this.form.level = 3
            this.form.timestamp3 = new Date().Format("yyyy-MM-dd hh:mm:ss")
            this.$util.post('public/updateTripartiteByPrimaryKeySelective', this.form).then(res => {
                this.$nextTick(() => {
                    this.$router.push({
                        name: 'reload'
                    })
                })
                this.$message({
                    type: 'success',
                    message: '操作成功！'
                });
            })
        },
        tripartiteIssue() {
            this.form.level = 4
            this.form.abrogation = true
            this.form.timestamp4 = new Date().Format("yyyy-MM-dd hh:mm:ss")
            this.$util.post('public/updateTripartiteByPrimaryKeySelective', this.form).then(res => {
                this.$nextTick(() => {
                    this.$router.push({
                        name: 'reload'
                    })
                })
                this.$message({
                    type: 'success',
                    message: '操作成功！'
                });
            })
        }
    }
}
</script>
